<%@ page language="java" import="java.util.*" pageEncoding="utf-8" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>订单确认</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <script src="../statics/js/rem.js"></script>
    <script src="../statics/js/jquery.min.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="../statics/css/base.css"/>
    <link rel="stylesheet" type="text/css" href="../statics/css/page.css"/>
    <link rel="stylesheet" type="text/css" href="../statics/css/all.css"/>
    <link rel="stylesheet" type="text/css" href="../statics/css/mui.min.css"/>
    <link rel="stylesheet" type="text/css" href="../statics/css/loaders.min.css"/>
    <link rel="stylesheet" type="text/css" href="../statics/css/loading.css"/>
    <link rel="stylesheet" type="text/css" href="../statics/slick/slick.css"/>
    <link rel="stylesheet" type="text/css" href="../statics//css/app.css"/>
    <link rel="stylesheet" type="text/css" href="../statics/css/mui.min1.css"/>
    <link href="../statics/css/mui.picker.css" rel="stylesheet"/>
    <link href="../statics/css/mui.poppicker.css" rel="stylesheet"/>
    <script type="text/javascript" src="../statics/js/jquery-1.12.4.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#sum").html(eval(${house.yajin}+${house.price}*${day}));
            $("#sumPrice").html(eval(${house.yajin}+${house.price}*${day}));
            var sumPrice = $("#sumPrice").html();
            var startDate = $("#startDate").val();
            var endDate = $("#endDate").val();
            var house_id = ${house.house_id};
            var fdusers_id = ${house.users_id};
            var ordersimage = $("#ordersimage").val();
            $("#xyb").click(function () {
                // alert(house_id+"-"+startDate+"-"+endDate+"-"+sumPrice+"-"+ordersimage)
                $.ajax({
                    type:"post",
                    url:"../orders/payment.json",
                    data:{
                        "house_id":house_id,
                        "firstday":startDate,
                        "lastday":endDate,
                        "price":sumPrice,
                        "fdusers_id":fdusers_id,
                        "ordersimage":ordersimage
                    },
                    success:function(result){
                        if(result.orders !="false"){
                            location.href="../orders/payment.html/"+result.orders+"";
                        }
                    }
                })
            })
        })
        $(window).load(function () {
            $(".loading").addClass("loader-chanage")
            $(".loading").fadeOut(300)
        })
    </script>
</head>
<%
    Object name = session.getAttribute("user");
    if (name == null) {
        out.print("<script>alert('请登录');location='/jsp/sign.jsp'</script>");
    }
%>
<!--loading页开始-->
<div class="loading">
    <div class="loader">
        <div class="loader-inner pacman">
            <div></div>
            <div></div>
            <div></div>
            <div></div>
            <div></div>
        </div>
    </div>
</div>
<!--loading页结束-->
<body>
<div class="headertwo clearfloat" id="header">
    <a href="javascript:history.go(-1)" class="fl box-s"><i class="iconfont icon-arrow-l fl"></i></a>
    <p class="fl">订单确认</p>
</div>

<div class="order clearfloat" id="main">
    <div class="pay-top clearfloat">
        <ul>
            <li class="cur">
                <span>1</span>
                <p>提交信息</p>
            </li>
            <li class="cur">
                <span>2</span>
                <p>订单确认</p>
            </li>
            <li>
                <span>3</span>
                <p>租客付款</p>
            </li>
            <li>
                <span>4</span>
                <p>付款成功</p>
            </li>
        </ul>
        <span class="hline">
					<samp class="bline blinetwo"></samp>
				</span>
    </div>
    <div class="order-top clearfloat box-s">
        <div class="tu clearfloat fl">
            <span></span>
            <c:set value="${fn:split(fimg,',')}" var="names"/>
            <c:forEach items="${names}" var="img" varStatus="item">
                <c:if test="${item.index==0}">
                    <input type="hidden" value="${img}" id="ordersimage">
                    <img src="../statics/upload/${img}" />
                </c:if>
            </c:forEach>
        </div>
        <div class="right clearfloat fl">
            <p class="tit">${house.title}</p>
            <p class="fu-tit">${cityName}${house.xxaddress}</p>
        </div>
    </div>
    <div class="land-ctent clearfloat pay-bottom order-bottom">
        <ul>
            <li class="box-s clearfloat">
                <p class="tit fl">押金</p>
                <p class="xinxi fr">${house.yajin}</p>
            </li>
            <li class="box-s clearfloat">
                <p class="tit fl">单日房租</p>
                <p class="xinxi fr">${house.price}</p>
            </li>
            <li class="box-s clearfloat">
                <input type="hidden" value="${startDate}" id="startDate">
                <input type="hidden" value="${endDate}" id="endDate">
                <p class="tit fl">天数：</p>
                <p class="xinxi fr">${day}</p>
            </li>

            <li class="box-s clearfloat" id='showUserPicker'>
                <p class="tit fl">优惠券</p>
                <input type="text" name="" id="" value="" placeholder="请选择" readonly="readonly" class="fl day daytwo" />
                <i class="iconfont icon-arrowright fl"></i>
            </li>
        </ul>
    </div>
    <div class="total clearfloat box-s">
        <ul>
            <li class="box-s clearfloat">
                <p class="tit fl">订单总额：</p>
                <p class="price fr" id="sum"></p>
            </li>
            <li class="box-s clearfloat">
                <p class="tit fl">优惠金额：</p>
                <p class="price fr">¥xxx</p>
            </li>
            <li class="box-s clearfloat">
                <p class="tit fl">可获得积分：</p>
                <p class="price fr">xxx</p>
            </li>
        </ul>
    </div>
</div>

<div class="order-footer clearfloat" id="footer">
    <p class="price fl box-s">应付金额：<span id="sumPrice"></span></p>
    <a style="cursor: pointer" class="fr" id="xyb">下一步</a>
</div>

</body>

<script src="../statics/js/fastclick.js"></script>
<script src="../statics/js/mui.min.js"></script>
<script type="text/javascript" src="../statics/js/hmt.js"></script>
<script src="../statics/js/mui.picker.js"></script>
<script src="../statics/js/mui.poppicker.js"></script>
<script src="../statics/js/city.data.js" type="text/javascript" charset="utf-8"></script>
<script src="js/city.data-3.js" type="text/javascript" charset="utf-8"></script>
<script>
    (function ($, doc) {
        $.init();
        $.ready(function () {
            //普通示例
            var userPicker = new $.PopPicker();
            userPicker.setData([{
                value: '',
                text: '10元优惠券'
            }, {
                value: '',
                text: '20元优惠券'
            }, {
                value: '',
                text: '50元优惠券'
            }, {
                value: '',
                text: '30元优惠券'
            }, {
                value: '',
                text: '70元优惠券'
            }, {
                value: '',
                text: '100元优惠券'
            }, {
                value: '',
                text: '20元优惠券'
            }, {
                value: '',
                text: '15元优惠券'
            }, {
                value: '',
                text: '50元优惠券'
            }, {
                value: '',
                text: '80元优惠券'
            }]);
            var showUserPickerButton = doc.getElementById('showUserPicker');
            var userResult = doc.getElementById('userResult');
            showUserPickerButton.addEventListener('tap', function (event) {
                userPicker.show(function (items) {
                    userResult.innerText = JSON.stringify(items[0]);
                    //返回 false 可以阻止选择框的关闭
                    //return false;
                });
            }, false);


        });
    })(mui, document);
</script>
</html>
